<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="_userFragment :: headAddCss(~{::title},'/css/login.css')">
    <meta charset="UTF-8">
    <title>登录</title>
    <link rel="stylesheet" href="../static/layui/css/layui.css">
    <link rel="stylesheet" href="../static/css/main.css">
    <link rel="stylesheet" href="../static/css/login.css">
    <script src="../static/layui/layui.js"></script>
</head>
<body>
<!--左边-->
<div id="left" class="layui-col-md8"><span style="font-size: 30px"></span><span></span></div>
<!--右边-->
<div id="card" class="layui-card layui-col-md4 ">
    <div class="layui-card-header" id="loginHeader">贫困生资助系统</div>
    <div class="layui-card-body">
        <!--form表单-->
        <form class="layui-form" action="/login" method="post">
            <div class="layui-form-item">
                <label class="layui-form-label">用户名</label>
                <div class="layui-input-inline">
                    <input type="text" name="userName" required  lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">密码框</label>
                <div class="layui-input-inline">
                    <input type="password" name="userPassword" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">验证码</label>
                <div class="layui-input-inline" style="width: 110px">
                    <input type="password" name="code" required lay-verify="required" placeholder="请输入验证码" autocomplete="off" class="layui-input">
                </div>
                <div id="imgDiv" class="layui-form-mid"><img th:src="@{/codeImg}" id="codeImg" src="https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=2995143552,1363900887&fm=26&gp=0.jpg"></div>
            </div>
            <a href="#" th:href="@{/register}" style="float: right;margin-bottom: 8px;color: blue;">还没有账号？去注册</a>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit lay-filter="formDemo">登录</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </form>
    </div>
</div>
</body>
<script>
    layui.use('form', function(){
    });
    //弹出消息
    layui.use('layer', function(){
        var layer = layui.layer;
        var msg = "[[${msg}]]";
        if (msg!=null&&msg!=""){
            layer.msg(msg);
        }
    });
    layui.use('jquery',function () {
        var $ = layui.$;
        $('#codeImg').click(function () {
            //由于传过去的时间不一样，所以不是同一个请求
            $(this).attr('src','/codeImg?d='+new Date().getTime());
        });
    });
</script>
</html>
